<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
            <el-form-item label="姓名" prop="expertName">
                <el-input v-model="queryParams.expertName" placeholder="请输入姓名" clearable maxlength="10" show-word-limit
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="联系方式" prop="expertContact">
                <el-input v-model="queryParams.expertContact" placeholder="请输入联系方式" clearable maxlength="11"
                    show-word-limit @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="首页标识" prop="homeStatus">
                <el-select v-model="queryParams.homeStatus">
                    <el-option v-for="item in homeStatusList" :key="item.id" :value="item.id" :label="item.name">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="推荐标识" prop="recommendStatus">
                <el-select v-model="queryParams.recommendStatus">
                    <el-option v-for="item in homeStatusList" :key="item.id" :value="item.id" :label="item.name">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="是否上下架" prop="lineStatus">
                <el-select v-model="queryParams.lineStatus">
                    <el-option v-for="item in lineStatusList" :key="item.id" :value="item.id" :label="item.name">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
                    v-hasPermi="['business:expert:add']">新增</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
                    v-hasPermi="['business:expert:remove']">删除</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="warning"  icon="el-icon-download" size="mini"  @click="handleExport"
                    v-hasPermi="['business:expert:export']">导出</el-button>
            </el-col>
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
        <el-table v-loading="loading" :data="expertList" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="序号" align="center" width="55" type="index" />
            <el-table-column label="头像" align="center" prop="avatarUrl">
                <template slot-scope="scope">
                    <image-preview :src="scope.row.avatarUrl" :width="50" :height="50" />
                </template>
            </el-table-column>
            <el-table-column label="姓名" align="center" prop="expertName" min-width="100"
                :show-overflow-tooltip="true" />
            <el-table-column label="联系方式" align="center" prop="expertContact" min-width="150"
                :show-overflow-tooltip="true" />

            <el-table-column label="年龄" align="center" prop="age" min-width="100" :show-overflow-tooltip="true" />
            <el-table-column label="性别" align="center" prop="gender" :formatter="formatterCategory" min-width="60" />
            <!-- <el-table-column label="所在城市" align="center" prop="city" /> -->
            <el-table-column label="职称" align="center" prop="title" :show-overflow-tooltip="true" min-width="150" />
            <!-- <el-table-column label="累计咨询时长" align="center" prop="totalConsultHours" />
            <el-table-column label="从业年限" align="center" prop="workingYears" /> -->
            <el-table-column label="标签" align="center" prop="tags" :show-overflow-tooltip="true" min-width="150" />
            <!-- <el-table-column label="个人介绍" align="center" prop="introduction" />
            <el-table-column label="专家寄语" align="center" prop="expertSaying" /> -->
            <!-- <el-table-column label="是否启用" align="center" prop="isEnabled" /> -->
            <!-- <el-table-column label="个体咨询费用" align="center" prop="individualConsultCost" />
            <el-table-column label="家庭咨询费用" align="center" prop="familyConsultCost" />
            <el-table-column label="咨询人群编码" align="center" prop="crowdCode" />
            <el-table-column label="咨询人群名称" align="center" prop="crowdName" /> -->
            <el-table-column label="咨询领域" align="center" prop="domainName" :show-overflow-tooltip="true"
                min-width="150" />
            <!-- <el-table-column label="首页标识" align="center" prop="homeStatus" min-width="100"
                :show-overflow-tooltip="true">
                <template v-slot="scope">
                    <div v-if="scope.row.homeStatus == 0">否</div>
                    <div v-if="scope.row.homeStatus == 1">是</div>
                </template>
            </el-table-column> -->
            <el-table-column label="首页标识" align="center" :show-overflow-tooltip="true" min-width="100">
                <template slot-scope="scope">
                    <el-switch v-model="scope.row.homeStatus" active-value="1" inactive-value="0"
                        @change="handleStatusChange(scope.row, 'homeStatus')"></el-switch>
                </template>
            </el-table-column>
            <el-table-column label="推荐标识" align="center" :show-overflow-tooltip="true" min-width="100">
                <template slot-scope="scope">
                    <el-switch v-model="scope.row.recommendStatus" active-value="1" inactive-value="0"
                        @change="handleStatusChange(scope.row, 'recommendStatus')"></el-switch>
                </template>
            </el-table-column>

            <el-table-column label="上下架标识" align="center" :show-overflow-tooltip="true" min-width="100">
                <template slot-scope="scope">
                    <el-switch v-model="scope.row.lineStatus" active-value="0" inactive-value="1"
                        @change="handlelineStatus(scope.row)"></el-switch>
                </template>
            </el-table-column>
            <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" min-width="150" />
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160" fixed="right">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" @click="handleDetail(scope.row)"
                        v-hasPermi="['business:expert:detail']">详情</el-button>
                    <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
                        v-hasPermi="['business:expert:edit']">修改</el-button>
                    <el-button size="mini" type="text" @click="handleDelete(scope.row)"
                        v-hasPermi="['business:expert:remove']">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="getList" />
        <!-- 添加或修改专家信息对话框 -->
        <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
            <el-form ref="form" :model="form" :rules="rules" label-width="110px">
                <el-form-item label="姓名" prop="expertName">
                    <el-input :disabled="disabled" maxlength="10" show-word-limit v-model="form.expertName"
                        placeholder="请输入姓名" />
                </el-form-item>
                <el-form-item label="联系方式" prop="expertContact">
                    <el-input :disabled="disabled" maxlength="11" show-word-limit v-model="form.expertContact"
                        placeholder="请输入联系方式" />
                </el-form-item>

                <el-form-item label="头像" prop="avatarUrl">
                    <image-upload v-model="form.avatarUrl" :disabled="disabled" />
                </el-form-item>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="年龄" prop="age">
                            <el-input-number :disabled="disabled" v-model="form.age" :min="1" :max="1000"
                                :controls="false" label="请输入年龄"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="累计咨询时长" prop="totalConsultHours">
                            <el-input-number :disabled="disabled" v-model="form.totalConsultHours" :min="1"
                                :max="100000000" :controls="false" label="请输入累计咨询时长"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
                <!-- <el-form-item label="所在城市" prop="city">
                    <el-input v-model="form.city" placeholder="请输入所在城市" />
                </el-form-item> -->
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="性别" prop="gender">
                            <el-select :disabled="disabled" v-model="form.gender" placeholder="请选择性别"
                                style="width: 200px;">
                                <el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
                                    :value="dict.value"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="个体咨询费用" prop="individualConsultCost">
                            <el-input-number :disabled="disabled" :controls="false" v-model="form.individualConsultCost"
                                :precision="2" :step="0.1" :max="1000000" :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="从业年限" prop="workingYears">
                            <el-input-number :disabled="disabled" v-model="form.workingYears" :min="1" :max="100000000"
                                :controls="false" label="请输入从业年限"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="家庭咨询费用" prop="familyConsultCost">
                            <el-input-number :disabled="disabled" :controls="false" v-model="form.familyConsultCost"
                                :precision="2" :step="0.1" :max="1000000" :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-form-item label="职称" prop="title">
                    <el-input maxlength="100" :disabled="disabled" show-word-limit v-model="form.title"
                        placeholder="请输入职称，如国家二级心理咨询师" />
                </el-form-item>
                <el-form-item label="标签" prop="tags">
                    <el-input v-model="form.tags" :disabled="disabled" type="textarea" placeholder="请输入内容"
                        maxlength="100" show-word-limit rows="3" />
                </el-form-item>
                <el-form-item label="个人介绍" prop="introduction">
                    <editor v-model="form.introduction" :disabled="disabled" :min-height="192" />
                </el-form-item>
                <el-form-item label="专家寄语" prop="expertSaying">
                    <el-input v-model="form.expertSaying" :disabled="disabled" type="textarea" placeholder="请输入内容"
                        maxlength="100" show-word-limit rows="3" />
                </el-form-item>
                <!-- 擅长领域下拉框  多选 -->
                <el-form-item label="擅长领域" prop="domainName">
                    <el-select :disabled="disabled" style="width: 100%;" v-model="texpertDomain" multiple>
                        <el-option v-for="item in expertDomainList" :key="item.id" :label="item.domainName"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="擅长人群" prop="crowdCodeList">
                    <el-select :disabled="disabled" style="width: 100%;" multiple v-model="crowdCodeList"
                        placeholder="请选择擅长人群">
                        <el-option v-for="dict in dict.type.specific" :key="dict.value" :label="dict.label"
                            :value="dict.value"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="擅长流派" prop="schoolList">
                    <el-select :disabled="disabled" style="width: 100%;" v-model="texpertSchool" multiple>
                        <el-option v-for="item in expertschoolList" :key="item.id" :label="item.schoolName"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>

                <!-- <el-form-item label="咨询人群编码" prop="crowdCode">
                    <el-input v-model="form.crowdCode" type="textarea" placeholder="请输入内容" />
                </el-form-item>
                <el-form-item label="咨询人群名称" prop="crowdName">
                    <el-input v-model="form.crowdName" type="textarea" placeholder="请输入内容" />
                </el-form-item> -->
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="排序" prop="sortOrder">
                            <el-input-number :disabled="disabled" v-model="form.sortOrder" :min="1" :max="1000"
                                :controls="false" label="请输入排序号，越小越靠前"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="首页标识" prop="homeStatus">
                            <el-radio-group :disabled="disabled" v-model="form.homeStatus">
                                <el-radio v-for="dict in homeStatusList" :key="dict.id" :label="dict.id">{{ dict.name
                                    }}</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="12">
                        <el-form-item label="是否上下架" prop="lineStatus">
                            <el-radio-group :disabled="disabled" v-model="form.lineStatus">
                                <el-radio v-for="dict in lineStatusList" :key="dict.id" :label="dict.id">{{ dict.name
                                    }}</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="是否推荐" prop="recommendStatus">
                            <el-radio-group :disabled="disabled" v-model="form.recommendStatus">
                                <el-radio v-for="dict in homeStatusList" :key="dict.id" :label="dict.id">{{ dict.name
                                    }}</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-form-item label="所属区域">
                    <el-cascader :disabled="disabled" v-model="selectedArea" :options="regionData"
                        @change="handleAreaChange"></el-cascader>
                </el-form-item>

                <!-- 受训经历    教育经历   擅长流派-->
                <el-form-item label="备注" prop="remark">
                    <el-input :disabled="disabled" v-model="form.remark" type="textarea" placeholder="请输入内容" />
                </el-form-item>
                <el-divider content-position="center">教育经历</el-divider>
                <el-row v-if="!disabled" :gutter="10" class="mb8" style="display: flex;justify-content: end;">
                    <el-col :span="1.5">
                        <el-button type="primary" size="mini" @click="handleAddEducation">添加教育经历</el-button>
                    </el-col>
                </el-row>
                <el-table :data="form.texpertEducationList" ref="tExpertEducation">
                    <el-table-column type="selection" width="50" align="center" />
                    <el-table-column label="序号" align="center" type="index" width="50" />
                    <el-table-column label="教育经历" prop="institution" align="center">
                        <template slot-scope="scope">
                            <el-input :disabled="disabled" v-model="scope.row.institution"></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column v-if="!disabled" label="操作" align="center" class-name="small-padding fixed-width"
                        width="80" fixed="right">
                        <template slot-scope="scope">
                            <el-button type="danger" icon="el-icon-delete" circle
                                @click="handleDeleteEducation(scope.row)" />
                        </template>
                    </el-table-column>
                </el-table>
                <el-divider content-position="center">受训经历</el-divider>
                <el-row v-if="!disabled" :gutter="10" class="mb8" style="display: flex;justify-content: end;">
                    <el-col :span="1.5">
                        <el-button type="primary" size="mini" @click="handleAddTraining">添加受训经历</el-button>
                    </el-col>
                </el-row>
                <el-table :data="form.texpertTrainingList" ref="tExpertTraining">
                    <el-table-column type="selection" width="50" align="center" />
                    <el-table-column label="序号" align="center" type="index" width="50" />
                    <el-table-column label="受训经历" prop="trainingName" align="center">
                        <template slot-scope="scope">
                            <el-input :disabled="disabled" v-model="scope.row.trainingName"></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column v-if="!disabled" label="操作" align="center" class-name="small-padding fixed-width"
                        width="80" fixed="right">
                        <template slot-scope="scope">
                            <el-button type="danger" icon="el-icon-delete" circle
                                @click="handleDeleteTraining(scope.row)" />
                        </template>
                    </el-table-column>
                </el-table>
            </el-form>
            <div slot="footer" class="dialog-footer" v-if="!disabled">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { listExpert, getExpert, delExpert, addExpert, updateExpert } from "@/api/expert/expert";
import { domainList, schoolList } from '@/api/select'
import { regionData, CodeToText } from 'element-china-area-data';
export default {
    name: "Expert",
    dicts: ['specific', 'sys_user_sex'],
    data() {
        return {
            regionData,
            selectedArea: [],
            selectedAreaText: [],
            showviewSetting: false,
            lineStatusList: [
                {
                    id: '0',
                    name: "上架",
                },
                {
                    id: '1',
                    name: "下架",
                }
            ],
            homeStatusList: [
                {
                    id: '0',
                    name: "否",
                },
                {
                    id: '1',
                    name: "是",
                }
            ],
            // 专家id
            expertId: '',
            // 排班
            tExpertScheduleList: [],
            // --------------------------------------

            disabled: false,
            showSetting: false,
            showSetting2: false,
            // 流派列表
            expertschoolList: [],
            // 领域列表
            expertDomainList: [],
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 子表选中数据
            checkedTExpertSchedule: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 专家信息表格数据
            expertList: [],
            // 专家排班表格数据
            tExpertScheduleList: [],
            // 弹出层标题
            title: "",
            // 是否显示弹出层
            open: false,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                expertName: null,
                age: null,
                gender: null,
                city: null,
                avatarUrl: null,
                title: null,
                totalConsultHours: null,
                workingYears: null,
                tags: null,
                introduction: null,
                expertSaying: null,
                isEnabled: null,
                sortOrder: null,
                individualConsultCost: null,
                familyConsultCost: null,
                crowdCode: null,
                crowdName: null,
                domainName: null,
                homeStatus: null,
                lineStatus: null,
                recommendStatus: null,
                expertContact: null
            },
            // 表单参数
            form: {
                texpertEducationList: [], texpertTrainingList: [], texpertSchool: []
            },
            // 表单校验
            rules: {
                avatarUrl: [
                    { required: true, message: "头像不能为空", trigger: "blur" }
                ],
                age: [
                    { required: true, message: "年龄不能为空", trigger: "blur" }
                ],
                gender: [
                    { required: true, message: "性别不能为空", trigger: "blur" }
                ],
                totalConsultHours: [
                    { required: true, message: "累计咨询时长不能为空", trigger: "blur" }
                ],
                workingYears: [
                    { required: true, message: "从业年限不能为空", trigger: "blur" }
                ],
                individualConsultCost: [
                    { required: true, message: "个体咨询费用不能为空", trigger: "blur" }
                ],
                familyConsultCost: [
                    { required: true, message: "家庭咨询费用不能为空", trigger: "blur" }
                ],
                expertContact: [
                    { required: true, message: "联系方式不能为空", trigger: "blur" },
                    {
                        pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
                        message: "请输入正确的手机号码",
                        trigger: "blur"
                    }
                ],
                title: [
                    { required: true, message: "职称不能为空", trigger: "blur" }
                ],
                tags: [
                    { required: true, message: "标签不能为空", trigger: "blur" }
                ],
                introduction: [
                    { required: true, message: "个人介绍不能为空", trigger: "blur" }
                ],
                expertSaying: [
                    { required: true, message: "专家寄语不能为空", trigger: "blur" }
                ],
                expertName: [
                    { required: true, message: "姓名不能为空", trigger: "blur" }
                ],
            },
            crowdCodeList: [], texpertSchool: [], texpertDomain: []
        };
    },
    computed: {
        hasConflicts() {
            return this.tExpertScheduleList.some(row => this.isConflict(row));
        }
    },
    mounted() { },
    created() {

        this.getList();
        domainList().then(res => {
            this.expertDomainList = res.rows
        })
        schoolList().then(res => {
            this.expertschoolList = res.rows
        })
    },
    methods: {
        handleAreaChange(value) {
            this.selectedArea = value;
            console.log(CodeToText);
            // 获取中文名称
            if (value.length === 3) {
                this.selectedAreaText = [
                    CodeToText[value[0]],  // 省
                    CodeToText[value[1]],  // 市
                    CodeToText[value[2]]   // 区
                ];
            } else if (value.length === 2) {
                this.selectedAreaText = [
                    CodeToText[value[0]],  // 省
                    CodeToText[value[1]]   // 市
                ];
            } else if (value.length === 1) {
                this.selectedAreaText = [
                    CodeToText[value[0]]   // 省
                ];
            }
        },
        handlelineStatus(row) {
            this.$modal.confirm('确认要修改上下架状态吗？').then(function () {
                return updateExpert({
                    id: row.id,
                    lineStatus: row.lineStatus
                })
            }).then(() => {
                this.$modal.msgSuccess("修改成功")
            }).catch(function () {
                row.lineStatus = row.lineStatus === "1" ? "0" : "1"

            })
        },
        handleStatusChange(row, status) {
            this.$modal.confirm('确认要修改状态吗？').then(function () {
                return updateExpert({
                    id: row.id,
                    homeStatus: row.homeStatus,
                    recommendStatus: row.recommendStatus,
                })
            }).then(() => {
                this.$modal.msgSuccess("修改成功")
            }).catch(function () {
                if (status == 'homeStatus') {
                    row.homeStatus = row.homeStatus === "1" ? "0" : "1"
                } else {
                    row.recommendStatus = row.recommendStatus === "1" ? "0" : "1"
                }

            })
        },
        closeDialog(e) {
            this.showSetting2 = e
            this.showviewSetting = e
        },
        formatterCategory(row, column) {
            let type = ""
            this.dict.type.sys_user_sex.forEach(item => {
                if (item.value == row.gender) {
                    type = item.label
                }
            })
            return type
        },
        /** 查询专家信息列表 */
        getList() {
            this.loading = true;
            listExpert(this.queryParams).then(response => {
                this.expertList = response.rows;
                this.total = response.total;
                this.loading = false;
            });
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        // 表单重置
        reset() {
            this.form = {
                expertContact: null,
                id: null,
                expertName: null,
                age: null,
                gender: null,
                city: null,
                avatarUrl: null,
                title: null,
                totalConsultHours: null,
                workingYears: null,
                tags: null,
                introduction: null,
                expertSaying: null,
                isEnabled: null,
                sortOrder: null,
                individualConsultCost: null,
                familyConsultCost: null,
                crowdCode: null,
                crowdName: null,
                domainName: null,
                delFlag: null,
                createBy: null,
                createTime: null,
                updateBy: null,
                updateTime: null,
                remark: null,
                homeStatus: '1',
                recommendStatus: '1',
                lineStatus: '0',
                texpertEducationList: [],
                texpertTrainingList: [],
                texpertSchool: []

            };
            this.crowdCodeList = [];
            this.texpertSchool = [];
            this.texpertDomain = [];
            this.selectedArea = [],
                this.selectedAreaText = []
            this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.id)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
        /** 新增按钮操作 */
        handleAdd() {
            this.reset();
            this.disabled = false
            this.open = true;
            this.title = "添加专家信息";
        },
        handleDetail(row) {
            this.disabled = true
            this.reset();
            getExpert(row.id).then(response => {
                this.form = response.data;
                this.texpertDomain = this.form.texpertDomainList.map(item => item.domainId)
                this.texpertSchool = this.form.texpertSchoolList.map(item => item.schoolId)
                this.crowdCodeList = this.form.crowdCode.split(",")
                this.selectedArea = this.form.cityCode ? this.form.cityCode.split(",") : []
                this.selectedAreaText = this.form.city ? this.form.city.split(",") : []
                console.log(this.selectedArea)
                this.open = true;
                this.title = "查看专家信息";
            });
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            this.reset();
            this.disabled = false
            const id = row.id || this.ids
            getExpert(id).then(response => {
                this.form = response.data;
                this.texpertDomain = response.data.texpertDomainList.map(item => item.domainId);
                this.texpertSchool = this.form.texpertSchoolList.map(item => item.schoolId)
                this.crowdCodeList = this.form.crowdCode.split(",")
                this.selectedArea = this.form.cityCode ? this.form.cityCode.split(",") : []
                this.selectedAreaText = this.form.city ? this.form.city.split(",") : []
                this.open = true;
                this.title = "修改专家信息";
            });
        },
        /** 提交按钮 */
        submitForm() {
            this.$refs["form"].validate(valid => {
                if (valid) {
                    let cityData = JSON.parse(JSON.stringify(this.selectedArea))
                    let selectedAreaText = JSON.parse(JSON.stringify(this.selectedAreaText))
                    this.form.cityCode = cityData.join(",")
                    this.form.city = selectedAreaText.join(",")

                    let data = []
                    this.texpertDomain.forEach(item => {
                        this.expertDomainList.forEach(items => {
                            if (item == items.id) {
                                data.push({
                                    domainName: items.domainName,
                                    domainId: items.id,
                                    domainDescribe: items.domainDescribe,
                                    avatarUrl: items.avatarUrl
                                })

                            }
                        })
                    })
                    this.form.texpertDomainList = data
                    this.form.crowdCode = this.crowdCodeList.join(',')
                    let crowdName = []
                    this.crowdCodeList.forEach(item => {
                        this.dict.type.specific.forEach(items => {
                            if (item == items.value) {
                                crowdName.push(items.label)
                            }
                        })
                    })
                    this.form.crowdName = crowdName.join(',')
                    let data1 = []
                    this.texpertSchool.forEach(item => {
                        this.expertschoolList.forEach(items => {
                            if (item == items.id) {
                                data1.push({
                                    schoolName: items.schoolName,
                                    schoolId: items.id,
                                    schoolDescribe: items.schoolDescribe
                                })

                            }
                        })
                    })
                    this.form.texpertSchoolList = data1
                    if (this.form.id != null) {
                        updateExpert(this.form).then(response => {
                            this.$modal.msgSuccess("修改成功");
                            this.open = false;
                            this.getList();
                        });
                    } else {
                        addExpert(this.form).then(response => {
                            this.$modal.msgSuccess("新增成功");
                            this.open = false;
                            this.getList();
                        });
                    }
                }
            });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            const ids = row.id || this.ids;
            this.$modal.confirm('是否确认删除专家信息数据项？').then(function () {
                return delExpert(ids);
            }).then(() => {
                this.getList();
                this.$modal.msgSuccess("删除成功");
            }).catch(() => { });
        },
        // 受训经历
        handleAddTraining() {
            let obj = {};
            obj.trainingDescribe = "";
            obj.indexs = this.form.texpertTrainingList.length + 1
            this.form.texpertTrainingList.push(obj);
        },
        // 教育经历
        handleAddEducation() {
            let obj = {};
            obj.institution = "";
            obj.indexs = this.form.texpertEducationList.length + 1
            this.form.texpertEducationList.push(obj);
        },
        /** 专家排班序号 */
        rowTExpertScheduleIndex({ row, rowIndex }) {
            row.index = rowIndex + 1;
        },
        /** 专家排班添加按钮操作 */
        handleAddTExpertSchedule() {
            let obj = {};
            obj.scheduleDate = "";
            obj.startScheduleTime = "";
            obj.endScheduleTime = "";
            obj.consultationType = "";
            obj.consultationStatus = "";
            obj.remark = "";
            this.tExpertScheduleList.push(obj);
        },
        // 教育经历
        handleDeleteEducation(row) {
            this.form.texpertEducationList = this.form.texpertEducationList.filter(item => {
                if (item.id) {
                    return item.id !== row.id;
                } else {
                    return item.indexs !== row.indexs;
                }

            });
        },
        // 受训经历
        handleDeleteTraining(row) {
            this.form.texpertTrainingList = this.form.texpertTrainingList.filter(item => {
                if (item.id) {
                    return item.id !== row.id;
                } else {
                    return item.indexs !== row.indexs;
                }
            });
        },
        /** 专家排班删除按钮操作 */
        handleDeleteTExpertSchedule(row) {
            // if (this.checkedTExpertSchedule.length == 0) {
            //     this.$modal.msgError("请先选择要删除的专家排班数据");
            // } else {
            //     const tExpertScheduleList = this.tExpertScheduleList;
            //     const checkedTExpertSchedule = this.checkedTExpertSchedule;
            //     this.tExpertScheduleList = tExpertScheduleList.filter(function (item) {
            //         return checkedTExpertSchedule.indexOf(item.index) == -1
            //     });
            // }
            this.form.texpertTrainingList = this.form.texpertTrainingList.filter(item => {
                return item.id !== row.id;
            });
        },
        /** 复选框选中数据 */
        handleTExpertScheduleSelectionChange(selection) {
            this.checkedTExpertSchedule = selection.map(item => item.index)
        },
        /** 导出按钮操作 */
        handleExport() {
            this.download('business/expert/export', {
                ...this.queryParams,
                ids:this.ids
            }, `专家_${new Date().getTime()}.xlsx`)
        },

    }
};
</script>
<style>
.conflict-row {
    background-color: #fff0f0 !important;
}

.conflict-row:hover>td {
    background-color: #ffe8e8 !important;
}

.schedule-picker,
.time-picker {
    width: 100%;
}
</style>
